import { Layout, Card, Breadcrumb, Button, Table,Space } from 'antd';
import { Component } from 'react';
import { EditTwoTone, DeleteTwoTone, SecurityScanTwoTone, } from '@ant-design/icons';
import axios from '@/utils/index.js'
class Classify extends Component {
  constructor() {
    super();
    this.state = {
      data : [
        
      ],
      columns : [
        { title: '#', dataIndex: 'cat_id', key: 'cat_id' },
        { title: '分类名称', dataIndex: 'cat_name', key: 'cat_name' },
        { title: '是否有效', dataIndex: 'cat_deleted', key: 'cat_deleted' },
        { title: '排序', dataIndex: 'address', key: 'address' },
        {
          title: '操作',
          dataIndex: '',
          key: 'x',
          render: (row, record) => (
            <Space size="middle">
              <Button icon={<EditTwoTone />} onClick={() => this.showeditModal(row, record.key)}></Button>
              <Button icon={<DeleteTwoTone />} onClick={() => this.removeItem(row, record.key)}></Button>
              <Button icon={<SecurityScanTwoTone />}></Button>
            </Space>
          ),
        },
      ]
    }
  }
  componentDidMount() {
    this.getCategory()
  }
  getCategory=async()=>{
    let res=await axios.get('/categories')
    console.log(res);
    this.setState({
      data:res.data.data
    })
  }
  addClassify = () => {
    console.log(1111);
  }
  render() {
    return (
      <Layout>
        <Breadcrumb style={{ margin: '5px 0', marginBottom: "10px" }}>
          <Breadcrumb.Item href="home">主页</Breadcrumb.Item>
          <Breadcrumb.Item href="user">用户</Breadcrumb.Item>
          <Breadcrumb.Item href="/home/user/user">列表</Breadcrumb.Item>
        </Breadcrumb>
        <Card>
          <Button onClick={this.addClassify} type="primary">添加分类</Button>
        </Card>
        <Table
          columns={this.state.columns}
          
          dataSource={this.state.data}
          pagination={false}
          rowKey="cat_id"/>
      </Layout>
    )
  }
}

export default Classify;
